<!DOCTYPE html>
<html >
	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>创建签到页</title>
		<link rel="stylesheet" type="text/css" href="../../css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../../css/base.css"/>
		<link rel="stylesheet" type="text/css" href="../../css/weui.min.css">
		<style type="text/css" media="screen">
			.mui-input-group .mui-input-row {
				height: 40px;
				display: block;
			}
			.head_div {
				background: #F0F0F0;
				height: 30px;
			}
			.head_div span {
				/* padding: 5px 10px; */
				padding-top: 5px;
				padding-bottom: 5px;
			}
			input[type=color], input[type=date], input[type=datetime-local], input[type=datetime], input[type=email], input[type=month], input[type=number], input[type=password], input[type=search], input[type=tel], input[type=text], input[type=time], input[type=url], input[type=week], select, textarea {
				line-height: 30px;
				width: 100%;
			}
			.stuname {
				padding: 11px 0;
				line-height: 2.1;
			}
			.padding_left_10 {
				padding-left: 10px;
			}
			.padding_right_10 {
				padding-right: 10px;
			}
			.bottom_15 {
				padding-bottom: 15px;
			}
			.clssName {
				width: 86%;
				height: 40px;
				line-height: 40px;
				vertical-align: middle;
				padding-bottom: 5px;
				padding-left: 16px;
				font-size: 16px;
				padding-right: 50px;
				/* color: #B0B0B0; */
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
			.mui-input-row input {
				/* margin-top: 0px; */
				padding-left: 16px;
				font-size: 16px;
				color: #000;
			}
			.marginLeft {
				margin-left: 16px;
				text-align: left;
			}
			.span_wight {
				width: 86%;
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
			}
			.base_add_icon {
				height: 22px;
				float: right;
				margin-right: 15px;
				margin-top: 10px;
			}
			.plan-arrow{
				position: absolute;
				right: 16px;
				height: 24px;
				top: 50%;
				margin-top: -12px;
			}
			.signbuttons>li{
				display: flex;
				align-items: center;
				justify-content: space-between;
			}
			.signbuttons .mui-table-view-cell>a:not(.mui-btn).mui-active{
			    background: transparent!important;
			}
			.signmethods li a.active{
				font-weight: bold;
			}
		</style>
	</head>
	<body class="base_gary_bg_color">
		<div id="main">
			<div class="base_style_color " id='BarAppearance' ></div>
			<div class="base_navigation_bar base_style_color base_navigation_item_bar">
				<a class="base_left_item" href="#" onclick="cancle()"> <img class="base_back_icon" src="../../image/icon_jiantou.png" alt=""> </a>
				<span>创建签到</span>
				<a class="base_right_item" href="#" onclick="done()" style="line-height:44px ">完成 </a>
			</div>
			<div class=" base_content_div base_content_font"  >
				<form class="  mui-input-group">
					<div class="head_div" >
						<span class="base_content_font base_dark_grey marginLeft" >签到名称</span>
					</div>
					<div class="mui-input-row" >
						<input id="name" maxlength="20" class="mui-navigate-right" type="text" placeholder="" onkeyup="chagetext20()">
					</div>
					<!--	<div class="head_div" >
					<span class="base_content_font base_dark_grey marginLeft" >选择班级</span>
					</div>-->
					<!-- <div class="mui-input-row">
					<span id="class" class="stuname mui-navigate-right span_wight " >选择班级</span>
					</div> -->
					<!-- <div class="mui-input-row" onclick="selectClass()">
					<span id="class" class=" mui-navigate-right clssName " ></span>
					</div>-->
					<div class="head_div" >
						<span class="base_content_font base_dark_grey marginLeft" >签到成功提示语</span>
					</div>
					<div class="mui-input-row" >
						<input id="name2" maxlength="20" class="mui-navigate-right" type="text" placeholder="" >
					</div>
					<div class="head_div" >
						<span class="base_content_font base_dark_grey marginLeft" >签到方式</span>
					</div>	
					<a class="mui-input-row" href="#picture">
						<input class="mui-navigate-right" id="signMethod" type="text" placeholder="" readonly="" value="请选择签到方式">
						<img class="plan-arrow" src="../../image/icon_youcejiantou.png">
					</a>						
				</form>
			</div>
		</div>
		<div id="offlineAlert" class="weui_dialog_confirm" hidden="hidden">
			<div class="weui_mask"></div>
			<div class="weui_dialog">
				<div class="weui_dialog_hd">
					<strong class="weui_dialog_title">是否确定退出当前页面？</strong>
				</div>
				<div class="weui_dialog_bd"></div>
				<div class="weui_dialog_ft">
					<a onclick="cleanCancelBack()" href="#" class="weui_btn_dialog default"  style="color:#18b4ed">取消</a>
					<a onclick="cleanConfirmSure()" href="#" class="weui_btn_dialog primary"  style="color:#18b4ed">确定</a>
				</div>
			</div>
		</div>
		<div id="showAlert" class="weui_dialog_confirm" hidden="hidden">
			<div class="weui_mask"></div>
			<div class="weui_dialog">
				<div class="weui_dialog_hd">
					<strong class="weui_dialog_title">是否确定开启此签到？</strong>
				</div>
				<div class="weui_dialog_bd"></div>
				<div class="weui_dialog_ft">
					<a  href="#" class="weui_btn_dialog default" id="openSign_no" style="color:#18b4ed">取消</a>
					<a  href="#" class="weui_btn_dialog primary" id="openSign_yes" style="color:#18b4ed">确定</a>
				</div>
			</div>
		</div>
		<!-- 选择签到方式 -->
		<div id="picture" class="mui-popover mui-popover-action mui-popover-bottom">
			<ul class="mui-table-view signbuttons">
				<li class="mui-table-view-cell">
					<a href="#picture"><b>取消</b></a>
					<a href="#picture" id="methods_ok"><b>确定</b></a>
				</li>				
			</ul>			
			<ul class="mui-table-view signmethods">
				<li class="mui-table-view-cell">
					<a href="#">签到码签到</a>
				</li>
				<li class="mui-table-view-cell">
					<a href="#">人脸识别签到</a>
				</li>
			</ul>
		</div>
	</body>
	<script type="text/javascript" src="../../script/jquery.min.js"></script>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/mui.min.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	<script type="text/javascript" src="../../script/common.js"></script>
	<script type="text/javascript" src="../../script/timeStampTool.js"></script>
	<script type="text/javascript" src="../../script/ui.js"></script>
	<script>
		mui('body').on('tap', '.signmethods li>a', function() {
			$(".signmethods li>a").removeClass('active');
			$(this).addClass('active');	
		})
		mui('body').on('tap', '#methods_ok', function() {
			var t = $(".signmethods li>a.active").html();
			if(t){
				$("#signMethod").val(t);
			}
		})		
	</script>
	<script type="text/javascript">
		var classarr = [];
		var tmpName = [];
		var idArr = [];
		var name = '';
		var content = '';
		var iid = "";
		var nameInitVal = '';//初始名称
		var promptInitVal = '';//初始提示信息
		apiready = function() {
			initHeaderUI();
			getSignZcode();
			$('#name2').val("签到成功!");
			promptInitVal = $('#name2').val();//初始提示信息赋值
			api.addEventListener({
				name : 'refreshClassData'
			}, function(ret, err) {
				if (ret.value) {
					classarr = ret.value.data;
					tmpName = [];
					for (var i = 0; i < classarr.length; i++) {
						tmpName.push(classarr[i].name);
					}
					idArr = [];
					for (var i = 0; i < classarr.length; i++) {
						idArr.push(classarr[i].id);
					}
					var str = '';
					for (var i = 0; i < tmpName.length; i++) {
						str += '' + tmpName[i] + ',';
					}
					var classlist = str.split(',');
					classlist.pop();
					//删除最后一个元素（最后一个元素为空字符串
					$('#class').text(classlist);
				}
			});
			api.addEventListener({
				name : 'keyback'
			}, function(ret, err) {
				cancle();
			});
			btnClick();
			sendBuriedNotifi('0', '老师端签到创建页', '195')
		}
		function sendBuriedNotifi(busionessid, pagetype, pagetypeid) {
			var userinfo = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				uname : $api.getStorage('cfnetppusername'),
			}
			var data = {
				busionessid : busionessid,
				pagetype : pagetype,
				pagetypeid : pagetypeid,
				sourceurl : api.pageParam.sourceurl,
				sourcetitle : api.pageParam.sourcetitle,
				accesspageurl : window.location.pathname,
				accesspagetitle : document.title,
				userinfo : userinfo
			}
			SendBehaviorTrajectoriesNotifi_Study(data);
		}

		//签到名称字数不能超过30字
		function chagetext20() {
			var len = $('#name').val().length;
			if (len == 20) {
				ShowToast("签到名称最多20字");
			}
		}

		//按钮点击事件
		function btnClick() {
			$('#openSign_no').click(function() {
				$('#showAlert').hide();
				sendBuriedNotifi('1', '老师端签到创建页', '195')
				api.closeWin();
			});
			//正常情况下是否退出当前考试按钮确定键
			$('#openSign_yes').click(function() {
				$('#showAlert').hide();
				start(iid)
			});
		}

		//开始活动
		function start(iid) {
			var params = {
				tid : 1,
				iid : iid,
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				action : 'start',
			}
			cfnetppPOST(url_actionDosign, params, true, function(data, status) {
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						api.sendEvent({
							name : 'reloadDataList',
						});
						openSignIngWin(iid);
					} else {
						ShowToast('开启失败');
					}
				}
			})
		}

		function getSignZcode() {//获取签到的默认序号,并设置
			var url = url_getZcode;
			var params = {
				jid : $api.getStorage('cfnetppjxid'),
			}
			cfnetppPOST(url, params, true, function(data, status) {
				if (status == 'success') {
					if (data.code == 200) {
						// alert(data.zcode);
						$('#name').val("签到-" + data.zcode);
					} else {
						$('#name').val("签到-" + getNowDateYue());
					}
				} else {
					$('#name').val("签到-" + getNowDateYue());
				}
				nameInitVal = $('#name').val();//初始名称赋值
			});
		}

		function cancle() {
			var cuName = $('#name').val();//当前名称
			var cuPrompt = $('#name2').val();//当前提示信息
			// console.log('nameInitVal:'+nameInitVal+'\ncuName:'+cuName+'\npromptInitVal:'+promptInitVal+'\ncuPrompt:'+cuPrompt);
			if (nameInitVal == cuName && promptInitVal == cuPrompt) {
				cleanConfirmSure();
			}else{
				$('#offlineAlert').show();
			}
		}

		function cleanCancelBack() {
			$('#offlineAlert').hide();
		}

		//确定
		function cleanConfirmSure() {
			$('#offlineAlert').hide();
			api.closeWin();
		}

		function isNull(str) {
			if (str == "")
				return true;
			var regu = "^[ ]+$";
			var re = new RegExp(regu);
			return re.test(str);
		}

		function done() {
			name = $('#name').val();
			content = $('#name2').val();
			var lengthName = name.length;
			var lenthContent = content.length;
			var aaa = 0;
			if (isNull(name)) {
				ShowToast("请填写签到名称");
			} else if (lengthName > 20) {
				ShowToast("签到名称最多20字");
			} else {
				aaa = 1;
			}
			var bbb = 0;
			if (isNull(content)) {
				ShowToast("请填写签到提示语");
			} else if (lenthContent > 20) {
				ShowToast("签到提示语最多20字");
			} else {
				bbb = 1;
			}
			//          var ccc = 0;
			//          if (idArr.length == 0) {
			//              ShowToast("请选择班级");
			//          }
			//          if (idArr.length > 0) {
			//              ccc = 1;
			//          }
			if (aaa && bbb) {
				createSign();
				// checkNameIsExist(name);
			}
		}

		function createSign() {
			var classid = '';
			for (var i = 0; i < idArr.length; i++) {
				classid += '' + idArr[i] + ',';
			}
			// alert(JSON.stringify(classid));
			var classlist = classid.split(',');
			classlist.pop();
			//删除最后一个元素（最后一个元素为空字符串）
			// alert(JSON.stringify(classid));
			var sssss = classlist.toString();
			showProgress();
			var params = {
				jid : $api.getStorage('cfnetppjxid'),
				uid : $api.getStorage('cfnetppuid'),
				tid : 1,
				classid : '',
				cid : api.pageParam.cid,
				pid : api.pageParam.pid,
				name : $('#name').val(),
				content : $('#name2').val(),
			};
			cfnetppPOST(url_addActive, params, false, function(data, status) {
			
				SendBusinessOperationsLogNotifi('老师端签到创建', '195', params, params, '', data, '老师端签到创建接口', '195-01')
				api.hideProgress();
				if (status == 'success') {
					if (data.code == 200) {
						api.sendEvent({
							name : 'reloadDataList',
						});
						iid = data.iid;
						$('#showAlert').show();
					} else if (data.code == 110) {
						api.toast({
							msg : '签到名称已存在',
							duration : 2000,
							location : 'bottom'
						});
					} else if (data.code == 108) {
						api.toast({
							msg : '失效',
							duration : 2000,
							location : 'bottom'
						});
					} else if (data.code == 101) {
						api.toast({
							msg : '参数错误',
							duration : 2000,
							location : 'bottom'
						});
					} else {
						ShowToast(data.message);
					}
				} else {
					api.toast({
						msg : '网络请求失败',
						duration : 2000,
						location : 'bottom'
					});
				}
			});
		}

		//打开签到详情页
		function openSignIngWin(iid) {
			var item = {
				name : $('#name').val(),
				id : iid
			}
			api.openWin({useWKWebView:true,
				name : 'Teacher_SigningFrame',
				url : 'Teacher_SigningFrame.html',
				pageParam : {
					id : iid,
					islist : false,
					item : item,
					sourceurl : api.pageParam.sourceurl,
					sourcetitle : api.pageParam.sourcetitle
				},
			});
		}

		function selectClass() {
			api.openWin({useWKWebView:true,
				name : 'select_class',
				url : 'select_class.html',
				pageParam : {
					data : classarr,
				},
			});
		}

		function getNowFormatDate() {
			var date = new Date();
			var seperator1 = "";
			var seperator2 = ":";
			var month = date.getMonth() + 1;
			var strDate = date.getDate();
			if (month >= 1 && month <= 9) {
				month = "0" + month;
			}
			if (strDate >= 0 && strDate <= 9) {
				strDate = "0" + strDate;
			}
			var currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate;
			return currentdate;
		}
	</script>
</html>
